<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>好友评价页</title>
		<link rel="stylesheet" type="text/css" href="css/comment.css"/>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	</head>
	<body>
		<div class="web">
			<div class="logo">
				<img src="img/home/logo.png"/>
			</div>
			<section>
				<!--头像-->
				<div class="headimg">
					<img src="img/comment/message_head.jpg"/>
				</div>
				<div class="title">
					<img src="img/comment/message_title.png"/>
				</div>
			</section>
			<!--选项部分-->
			<section>
				<div class="problem">
					<img src="img/comment/message_textl.png"/>
				</div>
				<!--选项部分-->
				<div class="option0 fr clear">
					<img src="img/comment/message_00.png"/>
				</div>
				<div class="option7">
					<img src="img/comment/message_70.png"/>
				</div>
				<div class="option9">
					<img src="img/comment/message_90.png"/>
				</div>
				<div class="option95">
					<img src="img/comment/message_95.png"/>
				</div>
			</section>
			<!--底部提交部分-->
			<section>
				<div class="commot_title">
					<img src="img/comment/message_ping.png"/>
				</div>
				<!--文本输入框-->
				<textarea>
						
				</textarea>
				<!--按钮-->
				<div class="bottom_btn">
					<div class="left">
						<img src="img/comment/message_input.png"/>
					</div>
					<div class="right">
						<img src="img/comment/message_submit.png"/>
					</div>
				</div>
			</section>
			<!--遮罩层-->
			<div class="masklayer">
				<div class="headimg">
					<img src="img/comment/zhezhao.png"/>
				</div>
				<div class="text">
					<img src="img/comment/zhezhao2.png"/>
				</div>
			</div>
		</div>
		
	</body>
	<script>
		var submit = document.querySelector(".web .left"),
		    masklayer= document.querySelector(".web .masklayer");
		
		/**提交按钮点击事件**/
		submit.addEventListener("click",function(){
			masklayer.style.webkitTransform="scale(1,1)";
			masklayer.style.background="rgba(0,0,0,.8)";
		});
		/**遮罩层点击事件：隐藏遮罩层**/
		masklayer.addEventListener("click",function(){
			masklayer.style.webkitTransform="scale(0,0)";
			masklayer.style.background="rgba(0,0,0,0)";
		});
		
		
		
	</script>
</html>
